<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8" />
    <title>MyPetStore</title>
    <link
      rel="StyleSheet"
      href="../../assets/css/mypetstoreNew.css"
      type="text/css"
      media="screen"
    />
  </head>
  <body>
    <div th:replace="common/top"></div>

    <div class="MainForm">
      <div class="FirstFloorText">
        <a
          href="categoryForm?categoryId=REPTILES"
          class="ReptileText"
          categoryId="REPTILES"
        >
          <div class="ReptileText-div">
            <ul class="ReptileText-ul"></ul>
          </div>
        </a>
      </div>

      <div class="SecondFloorText">
        <a
          href="categoryForm?categoryId=FISH"
          class="FishText"
          categoryId="FISH"
        >
          <div class="FishText-div">
            <ul class="FishText-ul"></ul>
          </div>
        </a>
        <div class="Welcome">
          <div class="WelcomeContentHere">
            <h1>Here,</h1>
          </div>
          <div class="WelcomeContentLove">
            <h1>find what you love</h1>
          </div>
        </div>
        <a
          href="categoryForm?categoryId=BIRDS"
          class="BirdText"
          categoryId="BIRDS"
        >
          <div class="BirdText-div">
            <ul class="BirdText-ul"></ul>
          </div>
        </a>
      </div>

      <div class="ThirdFloorText">
        <a
          href="categoryForm?categoryId=DOGS"
          class="DogText"
          categoryId="DOGS"
        >
          <div class="DogText-div">
            <ul class="DogText-ul"></ul>
          </div>
        </a>
        <a
          href="categoryForm?categoryId=CATS"
          class="CatText"
          categoryId="CATS"
        >
          <div class="CatText-div">
            <ul class="CatText-ul"></ul>
          </div>
        </a>
      </div>
    </div>

    <div th:replace="common/bottom"></div>
  </body>
</html>
